<template>
  <div class="inner">
    <div>
      <div>
        <div class="btitle" v-show="i==1">
          <p>博物馆</p>
        </div>
        <div class="btitle" v-show="i==2">
          <p>领导介绍</p>
        </div>
        <div class="btitle" v-show="i==3">
          <p>部门设置</p>
        </div>
        <div class="center">
          <div class="content" v-html="data1[0].zhengwen"></div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
var dataUrl;
export default {
  data() {
    return {
      i: "",
      data1: [{}],
    };
  },

  created() {
    if (this.$route.query) {
      this.orderId = this.$route.query.orderId;
      this.receive();
    }
    // this.receive();
    // this.get(dataUrl);
  },

  methods: {
    receive() {
      //通过判断菜单路由穿来的参数判断调用哪个接口渲染页面
      this.i = this.$route.query.orderId;
      // console.log(this.i, 111);
      this.i == 1
        ? (dataUrl = `${this.tableList}bowuguanjieshao-1-16`)
        : this.i == 2
        ? (dataUrl = `${this.tableList}lingdaojieshao-1-16`)
        : (dataUrl = `${this.tableList}bumenshezhi-1-16`);

      this.get(dataUrl);
    },
    get() {
      this.$api.get(dataUrl).then((res) => {
        // console.log(res.data.page.list);
        this.data1 = res.data.page.list;

        let data = res.data.page.list;
        var pic = data[0].zhengwen;
        // console.log(pic)
        var newPic = pic.replace(
          /src=[\'\"]?([^\'\"]*)[\'\"]?/gi,
          (keyword) => {
            keyword = keyword.split('"')[1];

            return 'src="' + this.IP + keyword + '"';
          }
        );
        // var a=pic.replace(/<a[^>]+href=['"]([^'"]*)['"]>/gi,(keyword)=>{
        //   keyword=keyword.split('"')[1]
        //   console.log(keyword)
        //   return `<a href="http://47.110.243.129${keyword}">http://47.110.243.129`
        // })
        // console.log(a)
        // data.metadata[0].value=a

        data[0].zhengwen = newPic;
        this.data1 = data;
      });
    },
  },

  watch: {
    $route(to, from) {
      if (to.query.orderId != from.query.orderId) {
        //如果；两次参数不一样
        this.i = to.query.orderId;
        this.receive();
      }
    },
  },
};
</script>
<style scoped>
.gwgk.content {
  display: flex;
  justify-content: space-between;
  color: #4e4b4b;
  max-width: 1200px;
  font-size: 24px;
  margin: auto;
  line-height: 40px;
  padding-top: 90px;
  box-sizing: border-box;
}
.btitle {
  text-align: center;
  padding: 30px 0px;
  box-sizing: border-box;
  background: url("../../assets/image/titlek.png") no-repeat;
  background-position: center;
  margin-bottom: 50px;
  font-size: 36px;
}
.title > p {
  padding-left: 35px;
  margin-bottom: 10px;
}
.gwgk .title {
  font-size: 30px;
  border-bottom: 2px solid rgb(107, 128, 173);
  color: rgb(107, 128, 173);
}
.gwgk li {
  list-style: none;
}
.gwgk ul,
li,
p {
  padding: 0px;
  margin: 0px;
}

.gwgk .right {
  background: rgb(230, 230, 230);
  width: 980px;
  height: 1190px;
  padding: 0 30px 0;
  box-sizing: border-box;
}

.gwgk .blue {
  color: rgb(25, 67, 119);
}
</style>
